<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>收货地址</title>
		<meta name="viewport"
			content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
		<link href="../../../../../../css/mui.css" rel="stylesheet" />
		<link href="../../../../../../css/mui.picker.css" rel="stylesheet" />
		<link href="../../../../../../css/mui.poppicker.css" rel="stylesheet" />
		<link rel="stylesheet" href="../../../../../../css/common.css" stylesheet" />
		<link rel="stylesheet" href="../../../../../../css/style.css" stylesheet" />
		<link rel="stylesheet" href="./css/index.css" />
	</head>
	<body>
		<div class="mui-content">
			<div class="main">
				<div class="item">
					<form class="mui-input-group">
						<div class="mui-input-row flex flexcenter">
							<label>收件人</label>
							<input type="text" class="mui-input-clear" placeholder="请输入收件人">
						</div>
						<div class="mui-input-row flex flexcenter">
							<label>联系方式</label>
							<input type="text" class="mui-input-clear" placeholder="请输入联系方式">
						</div>
						<div class="mui-input-row flex flexcenter" id='showCityPicker3'>
							<label>所在地区</label>
							<img src="../../../../../../images/home/icon_common_arrow_right.png">
							<div id='cityResult3'>
							</div>
							<!-- <button id='showCityPicker3' class="mui-btn mui-btn-block" type='button'>三级联动示例</button> -->
							<!-- 	<div id='cityResult3' class="ui-alert"></div> -->
						</div>
						<div class="mui-input-row flex flexcenter">
							<label>详细地址</label>
							<textarea id="textarea" rows="2" placeholder="多行文本框"></textarea>
						</div>
					</form>
					<div class="set flexaround">
						<span>设置默认地址</span>
						<!-- 这个类名是激活的	mui-active -->
						<div class="mui-switch mui-switch-mini" id="mySwitch">
							<div class="mui-switch-handle"></div>
						</div>
					</div>
					<div class="btn flex">
						<span class="delete">删除</span>
						<span class="save">保存</span>
						<span class="add">确认添加</span>
					</div>
				</div>
			</div>
		</div>
	</body>

	<script src="../../../../../../js/mui.min.js"></script>
	<script src="../../../../../../js/jquery-3.4.1.min.js"></script>
	<script src="../../../../../../js/resize.js" type="text/javascript"></script>
	<script src="../../../../../../js/mui.picker.js" type="text/javascript"></script>
	<script src="../../../../../../js/mui.poppicker.js" type="text/javascript"></script>
	<script src="../../../../../../js/city.data-3.js" type="text/javascript"></script>
	<script type="text/javascript">
		$(function($) {
			var _getParam = function(obj, param) {
				return obj[param] || '';
			};
			// 文档一加载就执行
			obj.setRem()
			// 窗口调节
			$(window).resize(function() {
				obj.setRem()
			});
			// 开关
			document.getElementById("mySwitch").addEventListener("toggle", function(event) {
				if (event.detail.isActive) {
					console.log("你启动了开关");
				} else {
					console.log("你关闭了开关");
				}
			})
			//获取地址//全部参数
			function getRequest() {
				var url = window.location.search; //获取url中"?"符后的字串
				var theRequest = new Object();
				if (url.indexOf("?") != -1) {
					var strs = url.substr(1).split("&");
					for (var i = 0; i < strs.length; i++) {
						theRequest[strs[i].split("=")[0]] = decodeURI(strs[i].split("=")[1]);
					}
				}
				return theRequest;
			}
			const params = getRequest()
			console.log('getRequest', params)
			// edit add
			if (params.type === 'edit') {
				$('.mui-switch').addClass('mui-active')
				$('.delete').css('display', 'block')
				$('.save').css('display', 'block')
				$('.add').css('display', 'none')
			} else {
				$('.delete').css('display', 'none')
				$('.save').css('display', 'none')
				$('.add').css('display', 'block')
				$('.mui-switch').removeClass('mui-active')
			}
			var cityPicker3 = new mui.PopPicker({
				layer: 3
			});
			cityPicker3.setData(cityData3);
			var showCityPickerButton = document.getElementById('showCityPicker3');
			var cityResult3 = document.getElementById('cityResult3');
			showCityPickerButton.addEventListener('tap', function(event) {
				// console.log("你选择的城市是:" + _getParam(items[0], 'text') + " " +
				// 	_getParam(items[1], 'text') + " " + _getParam(items[2], 'text'))
				cityPicker3.show(function(items) {
					cityResult3.innerText = _getParam(items[0], 'text') + " " +
						_getParam(items[1], 'text') + " " + _getParam(items[2], 'text');
					//返回 false 可以阻止选择框的关闭
					//return false;
				});
			}, false);
		})
	</script>
</html>
